<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<ng-container *ngFor="let jobForm of _values(this.jobForms)">
  <div class="aui-gutter-column-xxl">
    <div class="aui-gutter-column-lg">
      <lv-group lvGutter="8px">
        <h3>{{ jobForm.title }}</h3>
      </lv-group>
    </div>
    <lv-form>
      <lv-form-column *ngFor="let column of jobForm.values" lvWidth="50%">
        <lv-form-item *ngFor="let item of column">
          <lv-form-label>
            {{ item.label }}
          </lv-form-label>
          <lv-form-control>
            <ng-container [ngSwitch]="item.key">
              <ng-container *ngSwitchCase="'status'">
                <ng-container
                  *ngIf="
                    ['RUNNING', 'READY', 'ABORTING'].includes(job.status);
                    else elseTemplate
                  "
                >
                  <lv-progress
                    [lvValue]="job.progress"
                    [lvWidth]="100"
                    [lvStatus]="'normal'"
                    [lvColors]="job.colors"
                    class="progress-width"
                    [ngClass]="{
                      'aborting-progress': ['ABORTING'].includes(job.status)
                    }"
                  >
                  </lv-progress>
                </ng-container>
                <ng-template #elseTemplate>
                  <lv-group lvGutter="8px">
                    <aui-status [value]="item.value" type="Job_status">
                    </aui-status>
                    <ng-container
                      *ngIf="job.status === dataMap.Job_status.failed.value"
                    >
                      <span lv-overflow class="failed-tip">
                        ({{ job.progress }}%)
                      </span>
                    </ng-container>
                  </lv-group>
                </ng-template>
              </ng-container>
              <ng-container *ngSwitchDefault>
                <div lv-overflow class="value">
                  {{ item.value | nil }}
                </div>
              </ng-container>
            </ng-container>
          </lv-form-control>
        </lv-form-item>
      </lv-form-column>
    </lv-form>
  </div>
</ng-container>

<aui-sub-task-result [groupJobInfo]="job"></aui-sub-task-result>

<ng-template #headerTpl>
  <aui-custom-modal-operate [item]="detailData"></aui-custom-modal-operate>
</ng-template>